<template>
  <div login-component>
    <x-header class="x-header-orange" :left-options="{showBack:false }">
      登录
      <router-link slot="right" to="/register">注册</router-link>
    </x-header>
    <group>
      <x-input title="手机号码" v-model="phone" placeholder="亲输入手机号码" keyboard="number" is-type="china-mobile"></x-input>
      <x-input title="密码" v-model="password" placeholder="请输入密码" keyboard="number" type="password"></x-input>  
      <x-button type="primary" @click.native='onLoginClicked'>登录</x-button>  
    </group>  
  </div>
</template>
<script>
import './login.less'
import api from '../../services/apis'
import store from '../../stores/store'
import common from '../../stores/common'
import {Group,XInput,XButton,XHeader} from 'vux'

export default {
  components:{
    Group,XInput,XButton,XHeader
  },

  computed:{
    common(){
      return store.common;
    }
  },

  methods:{
    onLoginClicked(){
      api.auth.login(this.phone, this.password, true).then(d => {
        if (d.stat === 'ok') {
          this.$router.push('/home')
        } else {
          this.$vux.toast.show({
            type:"cancel",
            width:"15em",
            text: d.message
          })
        }
      })
    }
  },

  data(){
    return {
      phone:'',
      password:''
    }
  },

  created(){
    common.showTabbar = false;
  }

}
</script>

